<template>
	<div class="uploadImg">
		<el-upload :action="url"
				   list-type="picture-card"
				   :headers="headers"
				   :file-list="fileList"
				   :on-preview="handlePictureCardPreview"
				   :on-remove="handleRemove"
				   :on-success="handleSuccess">
			<i class="el-icon-plus"></i>
		</el-upload>
	</div>
</template>

<script>
import Cookies from 'js-cookie'

export default {
	name: 'uploadImg',
	data () {
		return {
			url: process.env.VUE_APP_BASE_API + '/upload/img',
			headers: {
				token: Cookies.get('token')
			}
		}
	},
	props: {
		fileList: {
			type: Array
		}
	},
	methods: {
		handleRemove (file, fileList) {
			console.log(file, fileList)
		},
		handlePictureCardPreview (file) {
			this.dialogImageUrl = file.url
			this.dialogVisible = true
		},
		handleSuccess (response, file, fileList) {
			this.$emit('uploadImgSuccess', response.data)
		}
	}
}
</script>

<style>
</style>
